<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			body{background-color:#98d0f8; color: #fff; text-align:center; font-size:12px;}
            body>div{margin-top:30px;}
            body>div>ul{padding:0; margin:0 auto;overflow: hidden;width: 620px;}
            body>div>ul>li{width:120px; list-style:none; border-left:dotted 1px; float:left;}
            body>div>ul>li:last-child{border-right: dotted 1px;}
    
		</style>
		<script src="../课件/jquery-2.1.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				var cityName = $('#city').val().trim();
				$('#search').click(function(){
					$.get('http://wthrcdn.etouch.cn/weather_mini',{city:cityName},function(response){
						console.log(response)
						var ul = document.createElement('ul');
//						var responed = JSON.parse(response);
//						for(var i = 0; i < responed.data.forecast.length; i++){
//							var currDate = responed.data.forecast[i];
//							var imgIndex = 1;
//							switch (currDate.type) {
//	                            case '多云':
//	                                imgIndex = 5;
//	                                break;
//	                            case '雷阵雨':
//	                                imgIndex = 16;
//	                                break;
//	                            case '阵雨':
//	                                imgIndex = 8;
//	                                break;
//	                        }
//							var li =document.createElement('li');
//							li.innerHTML += "<h4>" + currDate.date + "</h4>";
//	                        li.innerHTML += "<img src='day23/img/" + imgIndex + ".png' />";
//	                        li.innerHTML += "<p>" + currDate.type + "</p>";
//	                        li.innerHTML += "<p>" + currDate.high.replace('高温', '') + " - " + currDate.low.replace('低温', '') + "</p>";
//	                        li.innerHTML += "<p>" + currDate.fengli + "</p>";
//	                        li.innerHTML += "<p>" + currDate.fengxiang + "</p>";
//	                        ul.appendChild(li);
//						}
//						document.getElementById('container').innerHTML = "";
//                      document.getElementById('container').appendChild(ul);
					})
				})
			})
		</script>
	</head>
	<body>
		<input type="text" name="" id="city" value="" />
		<input type="button" name="" id="search" value="查询" />
		<div id="container">
			
		</div>
	</body>
</html>
